import React from 'react';
import BaseScreen from "./BaseScreen";
import styles from '../css/my.module.css';
import ProgressView from "../view/ProgressView";
import PressTouch from "../view/PressTouch";
import Range from "../view/Range/Range";
import * as locations from "../const/locations";
import {myNav} from "../const/imgs"
import {locationTo} from "../utils/LocationUtil"
import {clear} from '../utils/StorageUtil'

class Navigator extends BaseScreen {
    click = () => {
        locationTo(this.props.item.path)
    }

    render() {
        return (
            <div className={styles.nav_item}  onClick={this.click}>
                <div className={styles.nav_item_img} >
                    <img src={this.props.item.imgurl}/>
                </div>
                <div className={styles.nav_item_name} >
                    {this.props.item.name}
                </div>
            </div>
        )
    }
}

class Navlistone extends BaseScreen {
    click = () => {
        locationTo(this.props.item.path)
    }

    render() {
        return (
            <li className={styles.nav_list_one} onClick={this.click}>
                <div className={styles.nav_list_one_l}>
                    <img src={this.props.item.imgurl}/>
                    {this.props.item.name}
                </div>
                <div className={styles.nav_list_one_r}>
                    <img src='/authen/img/right.png'/>
                </div>
            </li>
        )
    }
}

class MyScreen extends BaseScreen {
    componentWillMount() {
        document.title = '我的';
    }

    componentWillUnmount(){
        console.log('unmount')
    }

    constructor(props) {
        super(props);
        this.state = {
            ...this.getDefaultState(),
            loanValue: 0
        };
    }
    //
    // i = 120;
    // tt = setInterval(() => {
    //     this.setState({
    //         getYzm: this.i + 's'
    //     });
    //     i--;
    //     if (i < 0) {
    //         clearInterval(tt);
    //         this.setState({
    //             getYzm: '重新获取'
    //         })
    //     }
    // }, 1000);

    time() {
        let i = 120;
        let tt = setInterval(() => {
            this.setState({
                getYzm: i + 's'
            });
            i--;
            if (i < 0) {
                clearInterval(tt);
                this.setState({
                    getYzm: '重新获取'
                })
            }
        }, 1000);

    }

    render() {
        return (
            <div>
                <button onClick={()=>{
                    this.time()
                }}>开始倒计时</button>

                <h2>{this.state.getYzm}</h2>
                <h3 onClick={()=>{
                    locationTo(locations.LOGIN)
                }}>login页</h3>
            </div>
        );
    }
}


export default MyScreen;